@charset "utf-8";
@function v($w) {
    @return ($w / 750) * 100+vw;
}
body {
    overflow-x: hidden;

}
// 搜索栏
.header {
    width: v(750);
    height: v(150);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 v(18);
    box-sizing: border-box;
    .logo {
        width: v(123);
        height: v(123);
        img {
            width: 100%;
        }
    }
    .back {
        width: v(132);
        height: v(57);
        box-sizing: border-box;
        text-align: center;
        border: solid 2px #ff9344;
        border-radius: 20px;
        line-height: v(55);
    }
    .search {
        box-sizing: border-box;
        width: v(266);
        height: v(51);
        position: relative;
        border: none;
        input {
            color: #777777;
            width: v(266);
            height: v(51);
            font-size: v(24);
            border: v(2) solid #ffbe8f;
            border-radius: v(25.5);
            position: absolute;
            text-indent: v(20);
        }

        .iconfont {
            position: absolute;
            color: #ffbe8f;
            top: v(13);
            right: v(8);
            font-size: v(32);
        }
    }

    .city {
        position: relative;
        box-sizing: border-box;
        width: v(159);
        height: v(51);
        select {
            width: v(159);
            height: v(60);
            border: v(2) solid #ffbe8f;
            font-size: v(26);
            text-indent: v(10);
            appearance: none;
        }

        .iconfont {
            position: absolute;
            color: #ffbe8f;
            top: v(15);
            right: v(15);
            font-size: v(30);
        }
    }
}
// 横幅栏
.banner {
    width: v(750);
    height: v(50);
    padding: v(33) v(20);
    display: flex;
    justify-content:space-between;
    align-items: center;
    font-size: v(24);
    box-sizing: border-box;
    .bannerLef {
        display: flex;
        align-items: center;
        height: v(50);
    }
    .bannerRig {
        display: flex;
        align-items: center;
        height: v(50);
    }
    h3 {
        font-size: v(30);
        text-indent:v(10) ;
    }
    & .iconfont:nth-of-type(1) {
        font-size: v(50);
        color: #ffbe8f;
    }
    & .iconfont:nth-of-type(2) {
        font-size: v(25);
        color: #ffbe8f;
    }
}
// foot 
.footer {
    width: v(750);
    display: flex;
    position: fixed;
    bottom: 0;
    background-color: #fff;
    justify-content: space-around;
    color: #ffbe8f;
    text-align: center;
    border: 1px solid rgba($color: #777777, $alpha: 0.1);
    .footCon {
        width: v(70);
        .iconfont {
            color: #ffbe8f;
            font-size:v(70) ;
        }
        p {
            color: black;
            font-size: v(26);
            line-height: v(50);
        }
    }
}
